﻿<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title>SiteServer 管理后台</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <link href="../assets/images/favicon.png" rel="icon" type="image/png">
  <link href="../assets/css/font-awesome-4.7.0.min.css" rel="stylesheet" type="text/css" />
  <link href="../assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
  <link href="../assets/lib/vue-multiselect-2.1.0/style.min.css" rel="stylesheet" type="text/css" />
  <link href="../assets/css/siteserver.min.css" rel="stylesheet" type="text/css" />
  <style> .nav .nav-link {
    font-weight: normal;
    border-radius: 1.25rem;
    font-size: 14px;
  }
</style>
</head>

<body>
  <div id="main" class="m-t-15 m-b-15 m-l-15 m-r-15">
    <template v-if="pageLoad">
      <div class="card-box" style="padding: 10px; margin-bottom: 10px">
        <ul class="nav nav-pills nav-justified">
          <li class="nav-item">
            <a class="nav-link active" href="javascript:;" @click="{btnNavClick('logs.html')}">数据列表</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="javascript:;" @click="{btnNavClick('fields.html')}">字段管理</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="javascript:;" @click="{btnNavClick('settings.html')}">选项设置</a>
          </li>
          <li class="nav-item" v-if="config.returnUrl">
            <a class="nav-link" :href="config.returnUrl">返回列表</a>
          </li>
        </ul>
      </div>
      <div class="card-box">
        <div v-if="pageAlert" class="alert" v-bind:class="{ 'alert-warning': pageAlert.type === 'warning', 'alert-success': pageAlert.type === 'success', 'alert-danger': pageAlert.type === 'danger' }">
          <button @click="pageAlert = null" class="close" data-dismiss="alert">×</button>
          <span v-html="pageAlert.html"></span>
        </div>
        <a href="javascript:;" @click="{btnNavClick('logAdd.html')}" class="btn btn-sm btn-outline-primary pl-3 pr-3">
          <i class="fa fa-plus"></i> 新 增 </a>
        <a href="javascript:;" @click="btnExportClick" class="btn btn-sm btn-outline-primary pl-3 pr-3">
          <i class="fa fa-download"></i> 导 出 </a>
        <a href="javascript:;" class="btn btn-sm btn-outline-primary pl-3 pr-3 dropdown-toggle" data-toggle="dropdown"
          aria-expanded="false">
          <i class="fa fa-columns"></i> 显示列 <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          <li v-for="attributeName in allAttributeNames" @click="btnVisibleClick(attributeName)" class="pl-2 checkbox checkbox-primary">
            <input type="checkbox" :checked="listAttributeNames.indexOf(attributeName) !== -1" :name="'col_' + attributeName"
              :id="'col_' + attributeName">
            <label :for="'col_' + attributeName">{{ getAttributeText(attributeName) }}</label>
          </li>
        </ul>
        <div class="table-responsive mt-3">
          <table class="table tablesaw table-hover m-0">
            <thead>
              <tr>
                <th v-for="attributeName in allAttributeNames" :key="attributeName" v-if="listAttributeNames.indexOf(attributeName) !== -1">
                  {{ getAttributeText(attributeName) }}</th>
                <th v-if="isReply">是否回复</th>
                <th v-if="isReply">回复时间</th>
                <th v-if="isReply">回复内容</th>
                <th class="text-center">操作</th>
              </tr>
            </thead>
            <tbody>
              <tr v-for="item in items" :key="item.id">
                <td v-for="attributeName in allAttributeNames" :key="attributeName" v-if="listAttributeNames.indexOf(attributeName) !== -1">
                  <img v-if="getAttributeType(attributeName) === 'Image'" :src="getAttributeValue(item, attributeName)" style="max-height: 100px; max-width: 100px; cursor: pointer;" v-on:click="largeImage(item, attributeName)">
                  <div v-else>
                      {{ getAttributeValue(item, attributeName) }}
                  </div>
                </td>
                <td v-if="isReply">
                  <strong v-if="item.isReplied" class="text-primary">已回复</strong>
                  <strong v-else class="text-danger">未回复</strong>
                </td>
                <td v-if="isReply">{{ (item.isReplied ? item.replyDate : "") }}</td>
                <td v-if="isReply">{{ (item.isReplied ? item.replyContent : "") }}</td>
                <td class="text-center text-nowrap">
                  <a v-if="isReply" href="javascript:;" @click="btnReplyClick(item.id)">回复</a>
                  <a href="javascript:;" class="ml-2" @click="btnEditClick(item.id)">编辑</a>
                  <a v-if="!item.isSystem" class="text-danger ml-2 text-nowrap" href="javascript:;" @click="btnDeleteClick(item.id)">删除</a>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
        <hr />
        <div class="row">
          <div class="col-10">
            <ul class="pagination pagination-sm float-left">
              <li class="page-item" :class="{disabled : page === 1}">
                <a class="page-link" @click="loadFirstPage" :class="{'bg-light' : page === 1}" href="javascript:;">首 页</a>
              </li>
              <li class="page-item" :class="{disabled : page === 1}">
                <a class="page-link" @click="loadPrevPage" :class="{'bg-light' : page === 1}" href="javascript:;">上一页</a>
              </li>
              <li class="page-item" :class="{disabled : page === pages}">
                <a class="page-link" @click="loadNextPage" :class="{'bg-light' : page === pages}" href="javascript:;">下一页</a>
              </li>
              <li class="page-item" :class="{disabled : page === pages}">
                <a class="page-link" @click="loadLastPage" :class="{'bg-light' : page === pages}" href="javascript:;">末
                  页</a>
              </li>
            </ul>
          </div>
          <div class="col-2">
            <multiselect @select="onPageSelect" v-model="page" placeholder="Select one" :options="pageOptions"
              :searchable="false" :show-labels="false"></multiselect>
          </div>
        </div>
      </div>
    </template>
    <template v-else>
      <div class="text-center" style="margin-top: 100px">
        <img class="mt-3" src="../assets/images/loading.gif" />
        <p class="lead mt-3 text-nowrap">载入中，请稍后...</p>
      </div>
    </template>
  </div>
</body>

</html>
<script src="../assets/lib/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="../assets/lib/popper.min.js"></script>
<script src="../assets/lib/bootstrap.min.js"></script>
<script src="../assets/lib/lodash-4.17.10.min.js" type="text/javascript"></script>
<script src="../assets/lib/layer-3.1.1/layer.js" type="text/javascript"></script>
<script src="../assets/lib/sweetalert2-7.28.4.all.min.js" type="text/javascript"></script>
<script src="../assets/lib/vue-2.5.16.min.js" type="text/javascript"></script>
<script src="../assets/lib/vee-validate-2.1.0.js"></script>
<script src="../assets/lib/vee-validate-locale-zh_CN-2.1.0.js"></script>
<script src="../assets/lib/js.cookie-2.2.0.js"></script>
<script src="../assets/lib/es6-promise.auto.min.js"></script>
<script src="../assets/lib/axios-0.18.0.min.js"></script>
<script src="../assets/lib/es6-promise.auto.min.js"></script>
<script src="../assets/lib/axios-0.18.0.min.js"></script>
<script src="../assets/lib/vue-multiselect-2.1.0/script.min.js"></script>
<script src="../assets/js/utils.js" type="text/javascript"></script>
<script src="logs.js" type="text/javascript"></script>
